import React, { useState, createContext } from 'react'
import Parent from './Parent'
// 在孙子 Child 里面拿到 App 数据并修改

// !#1 创建 Context 对象
export const Context = createContext()

export default function App() {
  const [count, setCount] = useState(8)
  const changeCount = () => {
    setCount((count) => count + 1)
  }
  // !#2 通过 Context.Provider 配合 value 提供数据
  return (
    <Context.Provider
      value={{
        count,
        changeCount,
      }}
    >
      <div>
        App
        <hr />
        <Parent count={count} changeCount={changeCount} />
      </div>
    </Context.Provider>
  )
}
